import QtQuick 2.0
import "../common"
Background {
    width: 240
    height: 300

    ListView{
        id:view
        anchors.fill: parent
        anchors.margins: 20

        clip: true

        model: 100

        delegate: numberDelegate
        spacing: 4

        highlight: highlightComponent
        highlightFollowsCurrentItem: false
        focus: true
    }

    //设置高量的属性
    Component {
        id: highlightComponent

        Item{
            width: ListView.view.width
            height: ListView.view.currentItem.height

            y:ListView.view.currentItem.y

            Behavior on y{
                SequentialAnimation{
                    PropertyAnimation{target:highlightRectangle;
                        property: "opacity"; to: 0; duration: 200 } //不透明
                    NumberAnimation { duration: 1 }
                    PropertyAnimation { target: highlightRectangle;
                        property: "opacity"; to: 1; duration: 200 }

                }
            }

            GreenBox {
                id: highlightRectangle
                anchors.fill: parent
            }
        }
    }

    Component {
        id: numberDelegate

        Item {
            width: ListView.view.width
            height: 40

            Text {
                anchors.centerIn: parent
                font.pixelSize: 14
                text: index
            }
        }
    }
}
